<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<script src="js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init();
		</script>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">hello</h1>
		</header>
		<div class="mui-content">
			<div style="padding: 15px;">
				<button id="pickDateBtn" type="button" class="mui-btn" onclick="showDate();">选择日期</button>
			</div>
		</div>
		<div style="padding: 15px;">
			<button id="pickTimeBtn" class="mui-btn" onclick="showTime();">选择时间</button>
		</div>
		
		<script type="text/javascript">
			mui.init();
			
			function showDate(){
				var oDate = document.getElementById("pickDateBtn");
				oDate.addEventListener('tap', function(){
					var dDate = new Date();
					//设置当前日期（不设置默认当前日期）,注意：月份从0开始计算，其他由1开始计算
					dDate.setFullYear(2017, 6, 14);
					var minDate = new Date();
					//最小时间
					minDate.setFullYear(2011, 0, 1);
					var maxDate = new Date();
					//最大时间
					maxDate.setFullYear(2018, 1, 1);
					//plus.nativeUI.pickDate(fn1, fn2, obj{title, date(目前时间), minDate, maxDate}); fn1:用户选择了日期时触发的函数。 fn2:用户没有选择时触发。
					//plus这个对象只在模拟器或者真机上有效
					plus.nativeUI.pickDate(function(e){
						var d = e.date;
						mui.toast('您选择的日期是：'+d.getFullYear() + "-" + (d.getMonth() + 1) + "-" + d.getDate());
					},function(){
						mui.toast("您没有选择日期");
					}, {
						title: '请选择日期',
						date: dDate,
						minDate: minDate,
						maxDate: maxDate
					});
				});
			}
			
			function showTime(){
				var oTime = document.getElementById("pickTimeBtn");
				oTime.addEventListener('tap', function(){
					var dTime = new Date();
					//设置默认时间
					dTime.setHours(6, 0);
					plus.nativeUI.pickTime(function(e){
						var d = e.date;
						mui.toast("您选择的时间是：" + d.getHours() + ":" + d.getMinutes());
					}, function(e){
						mui.toast("您没有选择时间！");
					}, {
						title: "请选择时间",
						is24Hour: true,
						time: dTime
					});
				});
			}
		</script>
	</body>

</html>